<template>
<div class="login">
  <div class="login-con">
    <h1>Please Login</h1>
     <form >
       <!-- <el-form ref="form" :model="form" label-width="80px">
          <el-form-item label="活动名称">
            <el-input v-model="form.name"></el-input>
          </el-form-item>
          <el-form-item label="活动名称">
            <el-input v-model="form.name"></el-input>
          </el-form-item>
       </el-form> -->
       <div class="form-control">
         <input type="text" required v-model="from.Username">
         <label >
            <span style="transition-delay:0ms">E</span><span style="transition-delay:50ms">m</span><span style="transition-delay:100ms">a</span><span style="transition-delay:150ms">i</span><span style="transition-delay:200ms">l</span>
         </label>
        <span class="usertishi"></span>
       </div>
       <div class="form-control">
         <input type="password" required v-model="from.Password">
         <label >
           <span style="transition-delay:0ms">P</span><span style="transition-delay:50ms">a</span><span style="transition-delay:100ms">s</span><span style="transition-delay:150ms">s</span><span style="transition-delay:200ms">w</span><span style="transition-delay:250ms">o</span><span style="transition-delay:300ms">r</span ><span style="transition-delay:350ms">d</span>
         </label>
         <span class="passtishi"></span>
       </div>
       <button class="btn" @click="login()">Login</button>
     </form>
  </div>
  </div>
</template>

<script>
import { getlogin } from "../../api/login";
import roles from "@/router/roles";
// import axios from 'axios'
export default {

    data(){
      return{
        from:{
          Username:"",
          Password:""
        }
      }  
},
methods:{
    async login(){
      let houpaths = await getlogin({name:this.from.Username,pressword:this.from.Password});
      console.log(houpaths);
      if(houpaths !=""){
        this.$message.success({
          message:"登录成功"
        })
        sessionStorage.setItem("vuelogin",JSON.stringify(houpaths))
        roles(houpaths);
        
        this.$router.push("/Home/");
    } else {
         this.$message.error({
          message:"登录用户名或密码错误！"
        })
  }
}
}
}
</script>

<style  scoped>
@import url(./login.css);

</style>>

